//################################
// 版权所有：中国农业银行软件开发中心
// 系统名称：移动办公应用-手机版
// 文件名称：drawerContent.js
// 创建时间：2017年04月11日
// 创建人员：lemo
// 功能说明：drawer content
//################################
'use strict';

import React, {Component} from 'react';
import {
    View,
    StyleSheet,
    Text,
    Image,
    TouchableOpacity,
    InteractionManager,
} from 'react-native';
import PubSub from 'pubsub-js';

import {
    Colors,
    UIConstants,
    PubSubTopics,
    FontSizes,
    CommonData,
    Routes,
}from '../../common';
import Images from '../../images';

import LoginContainer from '../../login/containers/loginContainer';
import MyResetPwdContainer from '../../my/containers/myResetPwdContainer';
import MyTerms from '../../my/pages/myTerms';

import {clearLogin, logout,clearActionType} from '../../actions';
import * as ActionTypes from '../../actions/types';

class DrawerContent extends Component {

    constructor(props) {
        super(props);
    }

    componentWillReceiveProps(nextProps) {
        const { dispatch } = this.props;
        switch (nextProps.actionType) {
            case ActionTypes.LOGOUT_SUCCESS:
            case ActionTypes.LOGOUT_FAILED:
                //navigator to login page
                this.logoutSuccess();
                dispatch(clearActionType());
                break;
            case ActionTypes.LOGIN_LOGINWITHUSERNAMEPASSWORD_CLEAR:
                CommonData.isAppInitAfterLogin=true;
                NativeModules.PandaNativeModule.exitApp();
                break;
            default:
                break;
        }
    }

    onMenuSelected(index) {
        
        const {dispatch, navigatorRoot} = this.props;
        switch (index) {
            case 0:
                InteractionManager.runAfterInteractions(()=>{
                    PubSub.publish(PubSubTopics.GEZI_CLOSE_DRAWER);
                    navigatorRoot.push({
                        name: Routes.MY_RESETPWD,
                        component: MyResetPwdContainer,
                        friend: true,
                    });
                });
                break;
            case 1:
                InteractionManager.runAfterInteractions(()=>{
                    PubSub.publish(PubSubTopics.GEZI_CLOSE_DRAWER);
                    navigatorRoot.push({
                        name: Routes.MY_TERMS,
                        component: MyTerms,
                        friend: true,
                    });
                });
                break;
            case 3:
                PubSub.publish(PubSubTopics.SPINKIT_MODAL_OPEN, UIConstants.logout.logoutTips);
                CommonData.isAppInitAfterLogin=true;
                setTimeout(() => {
                    dispatch(logout());
                }, 1000);
                break;
            default:
                break;
        }
        
    }

    logoutSuccess() {
        PubSub.publish(PubSubTopics.SPINKIT_MODAL_CLOSE);
        CommonData.isAppInitAfterLogin=true;
        const { dispatch, navigatorRoot } = this.props;
        
        // 清理login state树
        dispatch(clearLogin());
        navigatorRoot.resetTo({
            name: Routes.LOGIN,
            component: LoginContainer,
            isLogout: true,
        });
    }
    
    render() {
        return (
            <View style={styles.container}>
                <View style={styles.drawertitle}>
                    <Text style={{fontSize:20}}>鸽子Game</Text>
                </View>
                <TouchableOpacity style={styles.menuview} onPress={() => this.onMenuSelected(0)}>
                    <Image source={Images.HomeActive} style={styles.menuiconleft} resizeMode={Image.resizeMode.contain} />
                    <Text style={styles.menutext}>{'修改密码'}</Text>
                    <Image source={Images.EmailDrawerRightArrow} style={styles.menuiconright} resizeMode={Image.resizeMode.contain} />
                </TouchableOpacity>
                <View style={styles.spliterview} />
                <TouchableOpacity style={styles.menuview} onPress={() => this.onMenuSelected(1)}>
                    <Image source={Images.HomeActive} style={styles.menuiconleft} resizeMode={Image.resizeMode.contain} />
                    <Text style={styles.menutext}>{'会员条款'}</Text>
                    <Image source={Images.EmailDrawerRightArrow} style={styles.menuiconright} resizeMode={Image.resizeMode.contain} />
                </TouchableOpacity>
                <View style={styles.spliterview} />
                <TouchableOpacity style={styles.menuview} onPress={() => this.onMenuSelected(2)}>
                    <Image source={Images.HomeActive} style={styles.menuiconleft} resizeMode={Image.resizeMode.contain} />
                    <Text style={styles.menutext}>{'联系客服'}</Text>
                    <Image source={Images.EmailDrawerRightArrow} style={styles.menuiconright} resizeMode={Image.resizeMode.contain} />
                </TouchableOpacity>
                <View style={styles.spliterview} />
                <TouchableOpacity style={styles.menuview} onPress={() => this.onMenuSelected(3)}>
                    <Image source={Images.HomeActive} style={styles.menuiconleft} resizeMode={Image.resizeMode.contain} />
                    <Text style={styles.menutext}>{'退出'}</Text>
                    <Image source={Images.EmailDrawerRightArrow} style={styles.menuiconright} resizeMode={Image.resizeMode.contain} />
                </TouchableOpacity>
                <View style={styles.spliterview} />
                <View style={styles.drawerfooter}>
                    <Text>{'©️ 鸽子游戏俱乐部2015 - 2017'}</Text>
                </View>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: Colors.asmpContainerBackgroud,
    },
    drawertitle: {
        alignItems:'center',
        height:60,
        justifyContent:'center'
    },
    spliterview: {
        height: 0.5,
        backgroundColor: Colors.lightGray,
    },
    menuview: {
        height: 55,
        flexDirection: 'row',
        alignItems: 'center',
        paddingLeft: 12,
        paddingRight: 12,
        backgroundColor: Colors.asmpBlockBackgroud,
    },
    menuiconleft: {
        width: 20,
        height: 20,
    },
    menutext: {
        flex: 1,
        fontSize: FontSizes.drawerMenu,
        color: Colors.headerBlack,
        textAlign: 'left',
        marginLeft: 8,
    },
    menuiconright: {
        alignItems: 'flex-end',
        marginRight: 0,
        width: 16,
        height: 16,
    },
    drawerfooter: {
        flex:1,
        marginBottom:30,
        justifyContent:'flex-end',
        alignItems:'center'
    }
});

export default DrawerContent;